import QtQuick 2.0

Item {
    id:menuRect;

    property int nItem: -1;

    signal selectItem(string strPathName,string strFileName);

    Rectangle{
        anchors.fill: parent;

        border.width: 2
        border.color: "lightblue";        

        Flow{
            anchors.margins: 15;
            spacing: 10;
            anchors.fill: parent;

            Rectangle{

                width: parent.width/2-parent.spacing;
                height: 40;

                MenuItem{
                    id:menuItem1;
                    anchors.fill: parent;

                    strText: qsTr("Page1:Programing");
                    strIcon: "/Icon/Pro/Icon/holder.ico";

                    onSelectTrig: {
                        if(nItem==2)menuRect.selectItem("/Pages/qml/Pages/Programing","Programing");
                    }
                }

            }

            Rectangle{
                width: parent.width/2-parent.spacing;
                height: 40;

                MenuItem{

                    id:menuItem2;
                    anchors.fill: parent;
                    strText: "Page2:ListView"
                    strIcon: "/Icon/Pro/Icon/holder.ico";

                    onSelectTrig: {
                        if(nItem==2)menuRect.selectItem("/qml/Pages/tableView","TabView");
                    }
                }

            }

            Rectangle{
                width: parent.width/2-parent.spacing;
                height: 40;

                MenuItem{

                    id:menuItem3;
                    anchors.fill: parent;
                    strText: "Page3:Template"
                    strIcon: "/Icon/Pro/Icon/holder.ico";

                    onSelectTrig: {
                        if(nItem==2)menuRect.selectItem("/qml/Pages/Template","Template");
                    }
                }

            }

            Rectangle{
                width: parent.width/2-parent.spacing;
                height: 40;

                MenuItem{

                    id:menuItem4;
                    anchors.fill: parent;
                    strText: "Page4:ListView"
                    strIcon: "/Icon/Pro/Icon/holder.ico";

                    onSelectTrig: {
                        if(nItem==2)menuRect.selectItem("/listView","ListView");
                    }
                }
            }

            Rectangle{
                width: parent.width/2-parent.spacing;
                height: 40;

                MenuItem{

                    id:menuItem5;
                    anchors.fill: parent;
                    strText: "abcdefg5"
                    strIcon: "/Icon/Pro/Icon/holder.ico";

                    onSelectTrig: {
                        if(nItem==2)menuRect.selectItem("/listView","ListView");
                    }
                }
            }

            Rectangle{
                width: parent.width/2-parent.spacing;
                height: 40;

                MenuItem{

                    id:menuItem6;
                    anchors.fill: parent;
                    strText: "abcdefg6"
                    strIcon: "/Icon/Pro/Icon/holder.ico";

                    onSelectTrig: {
                        if(nItem==2)menuRect.selectItem("/listView","ListView");
                    }
                }
            }

            Rectangle{
                width: parent.width/2-parent.spacing;
                height: 40;

                MenuItem{

                    id:menuItem7;
                    anchors.fill: parent;
                    strText: "abcdefg7"
                    strIcon: "/Icon/Pro/Icon/holder.ico";

                    onSelectTrig: {
                        if(nItem==2)menuRect.selectItem("/listView","ListView");
                    }
                }
            }

            Rectangle{
                width: parent.width/2-parent.spacing;
                height: 40;

                MenuItem{

                    id:menuItem8;
                    anchors.fill: parent;
                    strText: "abcdefg8"
                    strIcon: "/Icon/Pro/Icon/holder.ico";

                    onSelectTrig: {
                        if(nItem==2)menuRect.selectItem("/listView","ListView");
                    }
                }
            }

            Rectangle{
                width: parent.width/2-parent.spacing;
                height: 40;

                MenuItem{

                    id:menuItem9;
                    anchors.fill: parent;
                    strText: "abcdefg9"
                    strIcon: "/Icon/Pro/Icon/holder.ico";

                    onSelectTrig: {
                        if(nItem==2)menuRect.selectItem("/listView","ListView");
                    }
                }
            }

            Rectangle{
                width: parent.width/2-parent.spacing;
                height: 40;

                MenuItem{

                    id:menuItem10;
                    anchors.fill: parent;
                    strText: "abcdefg10"
                    strIcon: "/Icon/Pro/Icon/holder.ico";

                    onSelectTrig: {
                        if(nItem==2)menuRect.selectItem("/listView","ListView");
                    }
                }
            }

            Rectangle{
                width: parent.width/2-parent.spacing;
                height: 40;

                MenuItem{

                    id:menuItem11;
                    anchors.fill: parent;
                    strText: "abcdefg11"
                    strIcon: "/Icon/Pro/Icon/holder.ico";

                    onSelectTrig: {
                        if(nItem==2)menuRect.selectItem("/listView","ListView");
                    }
                }
            }

            Rectangle{
                width: parent.width/2-parent.spacing;
                height: 40;

                MenuItem{

                    id:menuItem12;
                    anchors.fill: parent;
                    strText: "abcdefg12"
                    strIcon: "/Icon/Pro/Icon/holder.ico";

                    onSelectTrig: {
                        if(nItem==2)menuRect.selectItem("/listView","ListView");
                    }
                }
            }
        }
    }
}

